<template>
  <div class="tool">
    <div class="tool-left">
      <el-button type="danger" size="small" @click="tapDelMulti" v-if="!isPicker && gridDo.delete">批量删除</el-button>
      <el-button type="primary" :size="isPicker ? 'mini' :'small'" @click="tapSetting">设置字段</el-button>
      <el-button type="primary" :size="isPicker ? 'mini' :'small'" @click="tapStartBorder" v-if="!isShowBorder">设置列宽</el-button>
      <el-button type="success" :size="isPicker ? 'mini' :'small'" @click="tapOverBorder" v-if="isShowBorder">保存列宽</el-button>
      <el-button type="primary" size="small" @click="tapCopy" v-if="!isPicker && gridDo.add">复制</el-button>
      <el-button type="primary" size="small" @click="tapExport" v-if="!isPicker && gridDo.export">导出</el-button>
      <el-button type="primary" size="small" @click="tapImport" v-if="!isPicker && gridDo.import">导入</el-button>
      <template v-for="item in gridTool" >
        <el-button v-if="!isPicker" size="small" :key="item.button" :type="item.buttonType ? item.buttonType:''" @click="tapTool(item)">{{item.button}}</el-button>
      </template>
    </div>
    <div class="tool-right">
      <el-button type="primary" size="small" @click="tapAdd" v-if="gridDo.add">新增</el-button>
    </div>
  </div>
</template>
<style scoped>
  .tool{display: flex;justify-content: space-between;margin-bottom:20px;}
</style>
<script>
export default {
  created(){

  },
  props:{
    isPicker:{
      type:Boolean,
      default(){
        return false;
      }
    },
    gridTool:{
      type:Array,
      default:function(){
        return []
      }
     
    },
    gridDo:{
      type:Object,
      default:function(){
        return {}
      }
     
    },
  },
  data(){
    return {
      form:{},
      isShowBorder:false,
    }
  },
  methods:{
    tapDelMulti(){
      this.$emit('tapDelMulti');
    },
    tapAdd(){
      this.$emit('tapAdd');
    },
    tapSetting(){
      this.$emit('tapSetting');
    },
    tapStartBorder(){
      this.isShowBorder = true;
      this.$emit('startBorder');
    },
    tapOverBorder(){
      this.isShowBorder = false;
      this.$emit('overBorder');
    },
    tapCopy(){
      this.$emit('tapCopy');
    },
    tapTool(item){
      this.$emit('tapTool',item);
    },
    tapExport(){

    },
    tapImport(){
      this.$emit('tapImport');
    },
  },
  components:{

  }
}


</script>